import React,{useEffect,useState,useRef} from 'react';
import {
    SafeAreaView,
    StyleSheet,
    ScrollView,
    View,
    Text,Image,
    TouchableWithoutFeedback, TextInput,
} from 'react-native';
import Header from '../../widgets/Header';
import {getffly} from '../../utils/common';
import screen from '../../utils/screen';
import {useStores} from '../../store';
import {observer} from 'mobx-react';
import {LGBtn} from '../../widgets/buttons';
import RequestUtil from '../../utils/RequestUtil';
import Api from '../../utils/Api';
import {AppModal} from '../../widgets/modal';



export default ({navigation})=>{


    const [data,setData] = useState(null)


    useEffect(()=>{
        getData()
    },[])

    const getData = ()=>{

        AppModal.showLoading();
        const {id,update} = navigation.state.params.data
        let url = Api.article + `/${id}/${update}.md`
        RequestUtil.get(url).then(res=>{

            let data = res.data
            console.log('faq detail',data)
            AppModal.hideTip()

            setData(data)
        },error=>{
            AppModal.hideTip()
            if(error.code === -111){
                AppModal.showError(error.msg)
            }else{
                AppModal.showError(error.msg)
            }
            console.log('faq list error',error)
        })

    }

    return (
        <View style={styles.container}>

            <Header title={''} navigation={navigation}/>

            {
                data && (
                    <ScrollView contentContainerStyle={styles.content}>

                        <Text style={{fontSize: 24,color:'#137468'}}>{data.title}</Text>

                        <Text style={{fontSize: 13,color:'#000',marginTop: screen.PIXEL_30}}>{data.content}</Text>



                    </ScrollView>
                )
            }



        </View>
    )
}

const styles= StyleSheet.create({
    container:{
        flex:1
    },
    content:{
        flex:1,
        paddingHorizontal:screen.PIXEL_40
    },


})
